<script setup lang="ts">
import { list, actions } from './data'

const clickItem = (val: any) => {
  console.log(val)
}
const clickAction = (val: any) => {
  console.log(val)
}
</script>

<template>
  <div class="notify-page">
    <MyNotify :value="66" :isDot="true" />
    <MyNotify :value="88" size="2em" :isDot="false" icon="el-icon-alarmclock" />
    <MyNotify :value="888" :max="999" />
    <MyNotify :value="666" :max="888">
      <template #default>
        <MyList @clickItem="clickItem" @clickAction="clickAction" :list="list" :actions="actions" />
      </template>
    </MyNotify>
  </div>
</template>

<style lang="scss" scoped>
.notify-page {
  display: flex;
  flex-direction: column;
  row-gap: 80px;
}
</style>
